<script setup>
import * as echarts from 'echarts'
import 'echarts-gl'
import { ref, reactive, onMounted } from 'vue'

let chartRef = ref()
onMounted(() => {
    initChart()
})


function initChart() {
    var myChart = echarts.init(chartRef.value);
    const option = {
        backgroundColor: '#000',
        globe: {
            baseTexture: 'src/assets/images/earth.jpg',
            shading: 'lambert',
        },
        light: { // 光照配置
            ambient: { // 环境光配置
                intensity: 0.1 // 环境光强度，取值范围0~1，值越大场景越亮
                             // 环境光会照亮场景中的所有物体,不会产生阴影
            },
            main: { // 主光源配置(平行光)
                intensity: 10.5 // 主光源强度，值越大高光越明显
                             // 主光源会从特定方向照射，产生明暗对比和阴影
            }
        }
    }

    myChart.setOption(option)
}

</script>
<template>
    <div ref="chartRef" style="width: 100%;height:100%;"></div>
</template>

<style lang="less" scoped>
</style>

